.checkbox-group {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 295px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px 0px 0px 0px;/*мои добавки*/
	margin-bottom: 15px;/*мои добавки*/
	max-width: 600px;
	user-select: none;
  border: 0px solid rgb(185, 33, 33);
  border-radius: 0.5rem;
	& > * {
		margin: .4rem 0.4rem;
	}
}

.checkbox-group h5 {
	padding: 0px 0px 0px 20px;
}

.checkbox1-group { /*добавлен мною*/
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 280px;
	border: 0px solid rgb(199, 199, 199);/*убрал рамку*/
    border-radius: 0.5rem;
	& > * {
		margin: .4rem 0.4rem;
	}
}


.checkbox-group-legend {
	padding: 0px 0px 0px 0px;/*мои добавки*/
	
	text-align: left;
	justify-content: left;
}



.checkbox-radio {
	margin:  0px 0px 5px 0px;/*мои добавки*/
	display: flex;
	justify-content: left;
	width: 280px;
	
}


.checkbox-input {
	// Code to hide the input
	clip: rect(0 0 0 0);
	clip-path: inset(100%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
	
	&:checked + .checkbox-tile {
		
    border: 2px solid rgb(96, 194, 236);
		/*box-shadow: 0 5px 10px rgba(#df0b0b, 0.1);*/
		color: rgb(96, 194, 236);
		&:before {
			transform: scale(1);
			opacity: 1;
			background-color: rgb(96, 194, 236);
			border-color: rgb(96, 194, 236);
		}
		
		.checkbox-icon, .checkbox-label {
			color: rgb(96, 194, 236);
		}
	}
	
	&:focus + .checkbox-tile {
		border-color: rgb(96, 194, 236);
  
		/*box-shadow: 0 5px 5px rgba(#000, 0.1), 0 0 0 4px rgb(96, 194, 236)c;*/
    box-shadow: none;
		&:before {
			transform: scale(1);
			opacity: 1;
		}
	}
}

.checkbox-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width:  120px;
	min-height: 5rem;
	border-radius: 0.5rem;
	border: 0px solid #e6e6e6;
	background-color: #fff;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	transition: 0.15s ease;
	cursor: pointer;
	position: relative;



	&:before {
		content: "";
		position: absolute;
		display: block;
		width: 1.25rem;
		height: 1.25rem;
		border: 2px solid #9c9c9c;
		background-color: #fff;
		border-radius: 50%;
		top: 0.25rem;
		left: 0.25rem;
		opacity: 0;
		transform: scale(0);
		transition: 0.25s ease;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'%3E%3C/rect%3E%3Cpolyline points='216 72.005 104 184 48 128.005' fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'%3E%3C/polyline%3E%3C/svg%3E");
		background-size: 12px;
		background-repeat: no-repeat;
		background-position: 50% 50%;
	}

	&:hover {
		border-color: #9c9c9c;
    
		&:before {
			transform: scale(1);
			opacity: 1;
      		}
	}
}

.checkbox-icon {
	transition: .375s ease;
	color: #494949;
	svg {
		width: 3rem;
		height: 3rem;
	}
}

.checkbox-label {
	color: #707070;
	transition: .375s ease;
	text-align: center;
}

/*Мои стили*/
h5{
  color:  #4f4f4f;
  font-size: 14px;
  font-weight: 600;
}

 input {
  border: 1px solid #9c9c9c;
  padding: 10px 10px 10px 10px;
  border-radius: 10px;
  width: 115px;  /*длина поля поиска;*/ 
  height: 40px;
  font-weight: 100;
  font-size: 15px;
  justify-content: center;  
   }

   input::placeholder {
      color:  rgb(121, 120, 120);      
   }

   .brand, .model {
	border: 1px solid #9c9c9c;
	padding: 10px 10px 10px 10px;
	border-radius: 10px;
	width: 250px;  /*длина поля поиска;*/ 
	height: 40px;
	font-weight: 100;
	font-size: 15px;
	justify-content: center;  
	 }
  
	 .brand::placeholder, .model::placeholder {
		color:  rgb(120, 121, 121);      
	 }
  



/*Мои бренды*/
   
   .checkbox1-group-legend {
	font-size: 1.5rem;
	font-weight: 700;
	color: #9c9c9c;
	text-align: center;
	line-height: 1.125;
	margin: 0;
	
   
}

.checkbox1-input {
	// Code to hide the input
	clip: rect(0 0 0 0);
	clip-path: inset(100%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
	&:checked + .checkbox1-tile {
		
    border: 2px solid rgb(96, 194, 236);
		box-shadow: 0 5px 10px rgba(#000, 0.1);
		color: rgb(96, 194, 236);
		&:before {
			transform: scale(1);
			opacity: 1;
			background-color: rgb(96, 194, 236);
			border-color: rgb(96, 194, 236);
		}
		
		.checkbox1-icon, .checkbox1-label {
			color: rgb(96, 194, 236);
		}
	}
	
	&:focus + .checkbox1-tile {
		border-color: rgb(96, 194, 236);
  
		/*box-shadow: 0 5px 5px rgba(#000, 0.1), 0 0 0 4px rgb(96, 194, 236)c;*/
    box-shadow: none;
		&:before {
			transform: scale(1);
			opacity: 1;
		}
	}
}

.checkbox1-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width:  110px;
	min-height: 2rem;
	border-radius: 0.5rem;
	border: 0px solid #e6e6e6;
	background-color: #fff;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	transition: 0.15s ease;
	cursor: pointer;
	position: relative;


	&:before {
		content: "";
		position: absolute;
		display: block;
		width: 1rem;
		height: 1rem;
		border: 2px solid #9c9c9c;
		background-color: #fff;
		border-radius: 50%;
		top: 0.15rem;
		left: 0.15rem;
		opacity: 0;
		transform: scale(0);
		transition: 0.25s ease;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'%3E%3C/rect%3E%3Cpolyline points='216 72.005 104 184 48 128.005' fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'%3E%3C/polyline%3E%3C/svg%3E");
		background-size: 12px;
		background-repeat: no-repeat;
		background-position: 50% 50%;
	}

	&:hover {
		border-color: #9c9c9c;
    
		&:before {
			transform: scale(1);
			opacity: 1;
      		}
	}
}

.checkbox1-icon {
	transition: .375s ease;
	color: #494949;
	svg {
		width: 2rem;
		height: 2rem;
	}
}

.checkbox1-label {
	color: #707070;
	transition: .375s ease;
	text-align: center;
}


.button-menu  { /*действие кнопки при наведении обращение к двум блокам через зяпятую ", .email .block button" */    
    margin: 0px 0px 0px 30px;
	cursor: pointer;
    border: 0;
    min-width: 230px;
    max-width: 230px;
    height: 45px;
    color: rgb(253, 253, 253);
    background: rgb(57, 180, 232);
    font-size: 17px;
    border-radius: 10px;
    transform: all 500ms ease;      
}

    .button-menu:hover {
        background: rgb(115, 198, 234);
    }

	.button-reset  { /*кнопка сброса фильтров */    
		margin: 10px 0px 0px 30px;
		cursor: pointer;
		font-size: 15px;
		border: 0;
		min-width: 230px;
		max-width: 230px;
		height: 45px;
		color: #494949;
		background: rgb(255, 255, 255);	
		transform: all 500ms ease;      
	}
	
		.button-reset:hover {
		color: rgb(96, 194, 236);
		background: rgb(255, 255, 255);
		}

.button-comparison  {    
	        margin: 0 auto;
			width: 100%;
			cursor: pointer;
			border: 0;
			color: #494949;
			background: #ffffff;
			transform: all 500ms ease;      
		}
		
	.button-comparison:hover {
			
			background:  rgb(206, 207, 207);
			}
	






/* начало Меню бренды добавлено только из-зи checkbox2-tile проверить задвоения с checkbox-tile*/

	.checkbox1-input {
		// Code to hide the input
		clip: rect(0 0 0 0);
		clip-path: inset(100%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
		width: 1px;
		&:checked + .checkbox2-tile {
			
		border: 2px solid rgb(96, 194, 236);
			box-shadow: 0 5px 10px rgba(#000, 0.1);
			color: rgb(96, 194, 236);
			&:before {
				transform: scale(1);
				opacity: 1;
				background-color: rgb(96, 194, 236);
				border-color: rgb(96, 194, 236);
			}
			
			.checkbox1-icon, .checkbox1-label {
				color: rgb(96, 194, 236);
			}
		}
		
		&:focus + .checkbox2-tile {
			border-color: rgb(96, 194, 236);
	  
			/*box-shadow: 0 5px 5px rgba(#000, 0.1), 0 0 0 4px rgb(96, 194, 236)c;*/
		box-shadow: none;
			&:before {
				transform: scale(1);
				opacity: 1;
			}
		}
	}
		.checkbox2-tile {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width:  120px;
		min-height: 5rem;
		border-radius: 0.5rem;
		border: 0px solid #e6e6e6;
		background-color: #fff;
		box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
		transition: 0.15s ease;
		cursor: pointer;
		position: relative;
	
	
		&:before {
			content: "";
			position: absolute;
			display: block;
			width: 1rem;
			height: 1rem;
			border: 2px solid #9c9c9c;
			background-color: #fff;
			border-radius: 50%;
			top: 0.15rem;
			left: 0.15rem;
			opacity: 0;
			transform: scale(0);
			transition: 0.25s ease;
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='192' fill='%23FFFFFF' viewBox='0 0 256 256'%3E%3Crect width='256' height='256' fill='none'%3E%3C/rect%3E%3Cpolyline points='216 72.005 104 184 48 128.005' fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='32'%3E%3C/polyline%3E%3C/svg%3E");
			background-size: 12px;
			background-repeat: no-repeat;
			background-position: 50% 50%;
		}
	
		&:hover {
			border-color: #9c9c9c;
		
			&:before {
				transform: scale(1);
				opacity: 1;
				  }
		}
	}
	
	.checkbox1-icon {
		transition: .375s ease;
		color: #494949;
		svg {
			width: 2rem;
			height: 2rem;
		}
	}
	
	.checkbox1-label {
		color: #707070;
		transition: .375s ease;
		text-align: center;
	}
		
/* конец Меню бренды добавлено только из-зи checkbox2-tile проверить задвоения с checkbox-tile*/


.icon-bar {
  width: 100%;
  overflow: auto;
  font-size: 26px;
  text-align: center;

}

.icon-bar-produkt {
	width: 100%;
	overflow: auto;
	font-size: 19px;
	text-align: center;
  }
  
.icon-bar a:hover {
   color: rgb(57, 180, 232);
}

.icon-bar-net:hover {
	color: rgb(140, 140, 140);
 }
 



.active {
  background-color: #4CAF50;
}


.icon-bar-produkt-button {
	width: 35px;
	font-size: 19px;
	background-color: rgba(255, 255, 255, 0);
	color:  #4f4f4f;
	/*border: 1px dashed #505050;	*/
  }

  .icon-bar-produkt-button:hover  {
	color: rgb(57, 180, 232);
	background-color: rgba(255, 255, 255, 0);
  }

  .icon-bar-produkt-button-1 {
	width: 35px;
	font-size: 19px;
	background-color: rgba(255, 255, 255, 0);
	color:  rgb(57, 180, 232);
	/*border: 1px dashed #505050;	*/
  }

  .icon-bar-produkt-button-1:hover  {
	color: rgb(120, 203, 239);
	background-color: rgba(255, 255, 255, 0);
  }